<!--
 * @Author: ljc
 * @Date: 2023-05-06 10:00:10
 * @LastEditors: g05047
 * @LastEditTime: 2023-07-05 14:14:57
 * @Description: 专家进行微调
-->
<template>
  <rk-dialog width="80%"
    height="70%"
    :title="title"
    :visible="visible"
    :destroyOnClose="true"
    @close="visible = false"
    :maskClosable="false">
    <div class="expert-main">
      <rk-grid ref="expertRef"
        title="专家列表"
        :dataUrl="dataUrl"
        boxConfig
        :params="queryParams"
        :columns="tableColumns"
        :pagerConfig='false'>
        <template #toolbar_tools>
          <el-input class="w-200px"
            style="margin-right: 15px;"
            v-model="queryParams.keyWords"
            placeholder="请输入专家名称"
            clearable
            @input="handleSearch">
          </el-input>
        </template>
      </rk-grid>
    </div>
    <template #footer>
      <el-button type="primary"
        @click="handleConfirm">保存</el-button>
      <el-button @click="hanldeClose">取消</el-button>
    </template>
  </rk-dialog>
</template>

<script setup>
import { ElMessage } from "element-plus"
import { ref } from "vue"
const props = defineProps({
  type: String,
  default: ''
})
const emit = defineEmits(['save'])
// 查询参数
let queryParams = reactive({
  keyWords: undefined,
  taskId: undefined,
  expertIds: undefined,
  ruleId: undefined
})
const defaultQueryParams = {
  keyWords: undefined,
  taskId: undefined,
  expertIds: undefined,
  ruleId: undefined
}
const expertRef = ref(null)
const visible = ref(false)
const title = ref('专家调整')
let dataUrl = computed(() => {
  return props.type === 'rule' ? '/reviewtask/getExpertListByRule' : '/reviewtask/getExpertListByProject'
})
const tableColumns = ref([
  { field: 'name', title: '姓名', width: 120, align: 'center', },
  {
    field: 'sex', title: '姓别', width: 120, align: 'center', formatter: ({ cellValue }) => {
      let sex = cellValue
      if (sex) {
        sex = cellValue == 1 ? '男' : '女'
      } else {
        sex = ''
      }
      return sex
    }
  },
  { field: 'age', title: '年龄', width: 120, align: 'center', },
  { field: 'title', title: '职称', width: 120, align: 'center', },
  { field: 'phone', title: '手机号', width: 120, align: 'center', },
  { field: 'idCard', title: '身份证号', width: 250, align: 'center', },
  { field: 'introduction ', title: '简介', width: 250, align: 'left', },
])
/**查询 */
const handleSearch = () => {
  expertRef.value.searchEvent()
}
/** 打开弹出层 */
const handleOpen = (params) => {
  visible.value = true
  queryParams = {
    ...defaultQueryParams
  }
  queryParams.taskId = params.taskId
  queryParams.expertIds = params.expertIds
  queryParams.applyId = params.applyId
  queryParams.ruleId = params.ruleId || undefined
}
/** 关闭弹窗 */
const hanldeClose = () => {
  visible.value = false
}
/** 确认提交 */
const handleConfirm = () => {
  const seleRows = expertRef.value.getCheckboxRecords()
  if (!seleRows || seleRows.length === 0) {
    ElMessage.warning(`请至少选择一条数据！`)
    return
  }
  emit('save', seleRows)
  visible.value = false
}
// 对外暴露方法
defineExpose({
  handleOpen
})
</script>
<style lang="scss" scoped>
.expert-main {
  width: 100%;
  height: 100%;
}
</style>